<div>
  <label for="Quantity" class="sr-only"> Quantity </label>

  <div class="flex items-center rounded-sm border border-gray-200">
    <button type="button" class="size-10 leading-10 text-gray-600 transition hover:opacity-75">
      &minus;
    </button>

    <input
      type="number"
      id="Quantity"
      value="1"
      class="h-10 w-16 border-transparent text-center [-moz-appearance:_textfield] sm:text-sm [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none"
    />

    <button type="button" class="size-10 leading-10 text-gray-600 transition hover:opacity-75">
      &plus;
    </button>
  </div>
</div>
